import React, { Component } from 'react'
// 列表渲染
// jsx 代码中不能使用 for循环 (for in)  (for  of)  foreach
// jsx 代码中可以使用 map 方法
// 如果非要使用类似于for循环语句，那么你可以先把每次循环得到的jsx代码压入到一个数组中
// 然后在jsx代码中渲染 数组即可
// 每次遍历时，都需要给列表项添加唯一标识 key
// export default class App extends Component {
//   state = {
//     list: ['a', 'b', 'c', 'd']
//   }
//   render() {
//     return (
//       <div>
//         {
//           this.state.list.map((item, index) => {
//             return <p key={ index }>{ item }</p>
//           })
//         }
//       </div>
//     )
//   }
// }
export default class App extends Component {
  state = {
    list: ['a', 'b', 'c', 'd']
  }
  render() {
    const arr = []
    for (var i = 0; i < this.state.list.length; i++) {
      arr.push(
        <p key= { i }>{ this.state.list[i]}</p>
      )
    }
    return (
      <div>
        {
          arr
        }
      </div>
    )
  }
}
